<template>
  <d2-container class="list-page" :class="{'page-compact':crud.pageOptions.compact}">
    <d2-crud-x
      @customHandleBtn="handleCustom"
      ref="d2Crud"
        v-bind="_crudProps"
        v-on="_crudListeners"
    >

      <div slot="header">
        <pcic-search ref="search" :options="crud.searchOptions" @submit="handleSearch" @reset="handleSearchReset"  />
        <el-button size="small" type="primary" @click="addRow"><i class="el-icon-plus"/> 新增</el-button>
        <crud-toolbar :refresh="null" :search="null" v-bind="_crudToolbarProps" v-on="_crudToolbarListeners"  />
      </div>
    </d2-crud-x>
  </d2-container>
</template>

<script>
import {AddObj, DelObj, GetList, UpdateObj} from './api'
import {crudOptions} from './crud'
import {d2CrudPlus} from 'd2-crud-plus'

export default {
  mixins: [d2CrudPlus.crud],
  methods: {
    addAfter(){

    },
    handleSearch (form = {}) {
      for (const key in form) {
        if (!form[key]) {
          delete form[key]
        }
      }
      if(Object.keys(form).length === 0){
        this.$message.warning("请输入查询条件！")
        return
      }
      this.doPageTurn(1)
      this.crud.searchOptions.form = form
      this.doValueResolve(form)
      this.doRefresh({ from: 'search' })
    },

    //空方法覆盖doLoad，不会一进来就加载数据
    doLoad () {

    },

    //空方法覆盖reComputeCrudHeight，必须保留
    reComputeCrudHeight(){},

    //将crud.js与d2-crud-x进行关联
    getCrudOptions () {
      return crudOptions
    },

    //调用分页查询接口
    pageRequest (query) {
      return GetList(query)
    },

    //调用新增接口
    addRequest (row) {
      return AddObj(row)
    },

    //调用修改接口
    updateRequest (row) {
      return UpdateObj(row)
    },

    //调用删除接口
    delRequest (row) {
      return DelObj(row.id)
    },

    //查询重置
    handleSearchReset(){
      this.$refs.search.$refs.searchForm.resetFields()
      this.doPageTurn(1)
      this.crud.list = []
      this.crud.pagination.total = 0
    },



    handleCustom(event){
      console.log(event.row)
      console.log(event.index)
    }
  }
}
</script>
